import React from "react";
import "../MIUIcss/user.scss";
import { useHistory } from "react-router-dom";
import { useSelector, useDispatch } from "react-redux";
import {
  AntOutline,
  MessageOutline,
  FireFill,
  RightOutline,
  FileOutline,
  TruckOutline,
  SetOutline,
  CouponOutline,
  GiftOutline,
  BankcardOutline,
  TeamOutline,
  GlobalOutline,
  AppstoreOutline,
} from "antd-mobile-icons";
import { HIDE_TABBER } from "../store/action-type/tabber";
function User() {
  const { replace } = useHistory();
  const disPatch = useDispatch();

  return (
    <div className="user">
      <div className="header">
        <div>
          <div className="tou">
            <img
              src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fup.enterdesk.com%2Fedpic_source%2Fc7%2F8a%2F03%2Fc78a030abf9940543004b4fea7ef3902.jpeg&refer=http%3A%2F%2Fup.enterdesk.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1645861125&t=501328f5c59cc7a32b8174d4dec49aeb"
              alt="头像"
            />
          </div>
        </div>
        <div className="username">
          <h3>233号智械</h3>
          <p>2333333333</p>
        </div>
        <div className="header_right">
          <i>
            <MessageOutline fontSize={30} />
          </i>
          <p>
            <span>
              <FireFill /> 会员积分
            </span>
          </p>
        </div>
      </div>
      <div className="main">
        <p
          onClick={() => {
            replace("/Myolder");
            disPatch({ type: HIDE_TABBER });
          }}
        >
          <span>我的订单</span>
          <span>
            全部订单
            <RightOutline />
          </span>
        </p>
        <div className="dai">
          <div>
            <i>
              <FileOutline fontSize={30} />
            </i>
            <span>待付款</span>
          </div>
          <div>
            <i>
              {" "}
              <TruckOutline fontSize={30} />
            </i>
            <span>待收货</span>
          </div>
          <div>
            <i>
              <FileOutline fontSize={30} />
            </i>
            <span>待付款</span>
          </div>
          <div>
            <i>
              <SetOutline fontSize={30} />
            </i>
            <span>退换修</span>
          </div>
        </div>
        <div className="main_footer">
          <img
            src="https://img.xiaopiu.com/userImages/img1471160792f3890.png"
            alt=""
          />
        </div>
      </div>
      <div className="footer">
        <div>
          <p>
            <CouponOutline />
            <span>优惠卷</span>

            <RightOutline />
          </p>
          <p>
            <GiftOutline />
            <span>会员福利</span>

            <RightOutline />
          </p>
          <p>
            <BankcardOutline />
            <span>我的钱包</span>
            <RightOutline />
          </p>
        </div>
        <div>
          <p>
            <TeamOutline />
            <span>服务中心</span>
            <RightOutline />
          </p>
          <p>
            <GlobalOutline />
            <span>小米之家</span>
            <RightOutline />
          </p>
          <p>
            <AppstoreOutline />
            <span>更多功能</span>
            <RightOutline />
          </p>
        </div>
        <div>
          <p>
            <SetOutline fontSize={16} />
            <span>设置</span>

            <RightOutline />
          </p>
        </div>
      </div>
    </div>
  );
}

export default User;
